<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="black" name="apple-mobile-web-app-status-bar-style">
    <meta content="telephone=no" name="format-detection">
    <title>我的佣金</title>
    <link rel="stylesheet" href="../css/base.css">
    <script type="text/javascript" src="../js/jquery-1.11.3.min.js"></script>
    <script type="text/javascript" src="../js/paramsTool.js"></script>
    <script type="text/javascript" src="../js/layer.js"></script>

</head>
<style type="text/css">
    /*红包列表*/
     .rbtop{font-size:15px;font-weight:bold;width:100%;height:50px;  line-height:50px;background:#cc3534; color:#FFF; text-align:center; }/*7.27修改*/
    .rbtop #extract{position: absolute; right: 5px;top: 5px;font-size:14px; height: 40px; line-height: 40px; width: 100px;}
    .listnum{background:#f7f7f7; margin-top:5px;width:100%;height:40px; line-height:40px;border-top:1px solid #ddd;border-bottom:1px solid #ddd;-webkit-box-shadow:0 0px 8px black;-moz-box-shadow:0 10px 10px black;}
    .listnum .left{float:left;width:40%;color:#898989;margin-left:20px;font-size:14px;}
    .listnum .right{float:right;width:40%;color:#1457bf;margin-right:15px;font-size:14px;text-align:right;}
    .listnmn{background:#ffd1d1; width:100%;height:40px;padding:1px 0;border-bottom: solid #ddd 1px; color:#000;display:block;overflow:hidden;}/*7.27修改*/
    .listmn{width:100%;height:40px;padding:1px 0;border-bottom: solid #ddd 1px; display:block; overflow:hidden;}
    .listbg_gray{background:#f7f7f7;}
    .listmn .mn,.listnmn .mn{ float:right;height:22px;line-height:22px; margin:10px 30px 0 0;text-align:right;font-size:14px; font-weight:bold;}/*8.26*/

    .listnmn .tm,.listmn .tm{width:150px; line-height:44px;float:left; padding:0 15px 0 15px; font-weight:bold;}/*8.26*/
</style>
<script>
    var host = window.location.origin;
    var openid = getCookie('wxopenid');//|| 'o4AyEt2gypi_z981XBQzM5in0q_U';
    var userCoin = getCookie('coin');// || 0;

    if(!openid){
        getWxCode();
        openid = getCookie('wxopenid');
        userCoin = getCookie('coin');
    }
    $(function () {
        var unsettled = 0;

        $.ajax({
            url: host + "/getPostList",
            type: "get",
            dataType: 'json',
            async: true,//请求是否异步，默认为异步，这也是ajax重要特性
            cache: false,
            headers: {"content-type": "application/json", "openid": openid},
            success: function (data) {
                if (data.code) {
                    alert('error:' + data.info);
                } else {

                    var list = data.list;
                    var totalCoin = 0;
                    for (var i = 0; i < list.length; i++) {
                        var listmn = $("<div></div>");
                        if (list[i].status) {
                            listmn.addClass('listmn');
                        } else {
                            listmn.addClass('listnmn');
                            unsettled++;
                        }

                        var tm = $("<div>" + dateFormate(list[i].addDate) + "</div>").addClass('tm').appendTo(listmn);
                        var mn = $("<div>收入 " + list[i].coin + " 金币</div>").addClass('mn').appendTo(listmn);
                        listmn.appendTo($('#listDiv'));
                        totalCoin += list[i].coin;

                    }
                    $('#listNum').html(list.length);
                    $('#unsettled').html(unsettled);
                    $('#totalCoin').html(totalCoin);
                }

            },
            error: function () {
                alert('获取数据失败,请重试!');
            }
        });

        $("#extract").click(function () {
            postClick();
        });

        $(".setClick").click(function () {
            postClick();
        });

    function postClick(){
        if(unsettled){
            $.ajax({
                url: host + "/extractCoin",
                type: "get",
                dataType: 'json',
                async: true,//请求是否异步，默认为异步，这也是ajax重要特性
                cache: false,
                headers: {"content-type": "application/json", "openid": openid},
                success: function (data) {
                    if(data.code){
                        layer.open({
                            content: data.info
                            ,skin: 'msg'
                            ,time: 1.5 //2秒后自动关闭
                        });
                    }else {
                        unsettled = 0;
                        $('#unsettled').html(unsettled);

                        var totalCoin = FloatAdd(data.totalCoin,userCoin);
                        setCookie('coin',totalCoin);
                        layer.open({
                            content: '成功提取'+data.totalCoin+'至您的账户!'
                            ,skin: 'msg'
                            ,time: 1.5 //2秒后自动关闭
                        });
                        $('#listDiv > .listnmn').css('background-color', '#f7f7f7');
                        var listmn=$("<div></div>").addClass('listnmn');
                        var tm=$("<div>"+dateFormate(new Date())+"</div>").addClass('tm').appendTo(listmn);
                        var mn = $("<div>成功结算 "+data.totalCoin+" 金币</div>").addClass('mn').appendTo(listmn);
                        $('#listDiv').prepend(listmn);

                    }
                },
                error: function () {
                    alert('提现失败,请重试!');
                }
            });
        }else {
            layer.open({
                content: '暂无可提取佣金哦!'
                ,skin: 'msg'
                ,time: 1.5 //2秒后自动关闭
            });
        }
    }

    });

</script>
<body>


    <!--顶部bar-->
    <div class="rbtop">
        已出纳<label id="totalCoin"> 0</label>金币
        <div id="extract">提取</div>
    </div>

    <!--顶部bar结束-->
    <div class="listnum">
        <div class="left">
            共<label id="listNum" style="color:#cc3534">0</label>条收入
        </div>
        <div class="right setClick">
           <label id="unsettled">0</label>条未结算
        </div>
    </div>
    <div class="hb_list" id="listDiv">

    </div>
</body>
</html>
